<template>
  <template v-for="item in items" :key="item.id">
    <!-- 含有子集 -->
    <el-sub-menu :index="String(item.id)" v-if="item.children && item.children.length > 0">
      <template #title>
        <svg-icon :icon-class="item.icon" style="margin-right: 10px"></svg-icon>
        <span>{{ item.title }}</span>
      </template>
      <sidebar-item :items="item.children"></sidebar-item>
    </el-sub-menu>
    <!-- 没有子集 -->
    <el-menu-item v-else :index="item.path" :route="item.path" :key="item.path">{{ item.title }}
    </el-menu-item>
  </template>
</template>

<script setup>
import SvgIcon from '@/components/common/SvgIcon/index.vue'
const props = defineProps(['items', 'basePath'])
</script>